<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>MS2</title>
<!-- Load the paper.js library -->
<script type="text/javascript" src="js/paper.js"></script>
<!-- Load the jquery.min.js library -->
<script type="text/javascript" src="js/jquery-1.7.min.js"></script>
<!-- Load the soccer.js library, Our script! -->
<script type="text/javascript" src="js/soccer.js"></script>
<script type="text/javascript">
window.onload = function() {
	/**
	/The Creating new object with set properties: width, height and id of the element 'canvas'  
	*/
	var s = new Soccer(200,260,"myCanvas");
	s.setActivPoint(64);
	/**
	/Assign the handler events 
	*/
	s.element.addEventListener('DOMMouseScroll', s.wheel, false);// Firefox (???onDOMMouseScroll = ..., ???addEventListener)
	s.element.addEventListener('mousewheel', s.wheel, false);// IE9+, Opera, Chrome/Safari (??onmousehweel = ...)
	/**
	/ Select element and Off context menu (right click mouse)
	*/
	s.element.oncontextmenu = function(){
		return false;
	}
}
</script>
<link href="style.css" type="text/css" rel="stylesheet">
</head>
<body>
	<div class="">
		<div class="" id="">
			<canvas id="myCanvas" style="Width:220px; Height:280px; border:1px red solid;"></canvas>
		</div>
	</div>
</body>
</html>